<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div id="container"></div>
  <script src="/xunni/bundle.js"></script>
  <script>
    // let templateStr = '我{{a.b.c}}今天心情很{{mood}},因为买了{{phone}},花了我{{money}}元'
    let templateStr = `
      <div>
        <ul>
          {{#students}}
            <div>{{age}}</div>
            <div>{{name}}</div>
              {{#hobbies}}
                <li>{{.}}</li>
              {{/hobbies}}
          {{/students}}
        </ul>
      </div>
    `
    // let templateStr = `
    //   <div>
    //     <ul>
    //       {{#students}}
    //         <li>{{name}}</li>
    //         {{.}}
    //       {{/students}}
    //     </ul>
    //   </div>
    // `
    // const data = {
    //   mood: 'happy',
    //   phone: 'HUAWEI',
    //   money: '2900',
    //   a: {
    //     b: {
    //       c: 100
    //     }
    //   }
    // }
    const data = {
      students: [
        { name: '张三', age: 15, hobbies: ['eat', 'sleep', 'rest'] },
        { name: '小明', age: 11, hobbies: ['move', 'run', 'play'] },
        { name: '小红', age: 15, hobbies: ['study', 'write', 'read'] }
      ]
    }
    let domStr = LWS_Template.render(templateStr, data);
    let div = document.getElementById('container');
    div.innerHTML = domStr;
  </script>
</body>

</html>